import { FC, useState } from "react"
import { Radio, Table, Tag, Space } from "antd"
import styles from "./medicine.less"
import { ColumnsType } from "antd/es/table"
// import { tabItemType } from '../index'
interface MedicineProps {
  tabItemType: number
}
const medicine: FC<MedicineProps> = ({
  tabItemType
}) => {

  const [tableScroll, setTableScroll] = useState<number>(500)
  const columns: ColumnsType<any> = [
    {
      title: "序号",
      dataIndex: "id",
      key: "id",
      align: "center",
      width: "57"
    },
    {
      title: "就诊日期",
      dataIndex: "datetime",
      key: "datetime",
      align: "center",
      width: "auto",
    },
    {
      title: "就诊科室",
      dataIndex: "deptName",
      key: "deptName",
      align: "center",
      width: "auto",
    },
    {
      title: "主要诊断",
      dataIndex: "description",
      key: "description",
      align: "center",
      width: "auto",
    },
    {
      title: "诊断代码",
      dataIndex: "descpCode",
      key: "descpCode",
      align: "center",
      width: "auto",
    },
    {
      title: "就诊类型",
      dataIndex: "type",
      key: "type",
      align: "center",
      width: "auto",
    },
    {
      title: "就诊医生",
      dataIndex: "docName",
      key: "docName",
      align: "center",
      width: "auto",
    }
  ]

  const data = [
    {
      id: "1",
      datetime: "20210428",
      deptName: "外科",
      description: "主要诊断信息",
      descpCode: "c5d45",
      type: 1,
      docName: "马医生"
    },
    {
      id: "2",
      datetime: "20210428",
      deptName: "内科科",
      description: "主要诊断信息",
      descpCode: "c5d45",
      type: 1,
      docName: "里医生"
    },
    {
      id: "3",
      datetime: "20210428",
      deptName: "儿科",
      description: "主要诊断信息",
      descpCode: "c5d45",
      type: 1,
      docName: "好医生"
    },
    {
      id: "4",
      datetime: "20210428",
      deptName: "内科科",
      description: "主要诊断信息",
      descpCode: "c5d45",
      type: 1,
      docName: "里医生"
    },
    {
      id: "5",
      datetime: "20210428",
      deptName: "儿科",
      description: "主要诊断信息",
      descpCode: "c5d45",
      type: 1,
      docName: "好医生"
    },
    {
      id: "6",
      datetime: "20210428",
      deptName: "内科科",
      description: "主要诊断信息",
      descpCode: "c5d45",
      type: 1,
      docName: "里医生"
    },
    {
      id: "7",
      datetime: "20210428",
      deptName: "儿科",
      description: "主要诊断信息",
      descpCode: "c5d45",
      type: 1,
      docName: "好医生"
    },
    {
      id: "8",
      datetime: "20210428",
      deptName: "儿科",
      description: "主要诊断信息",
      descpCode: "c5d45",
      type: 1,
      docName: "好医生"
    },
    {
      id: "9",
      datetime: "20210428",
      deptName: "内科科",
      description: "主要诊断信息",
      descpCode: "c5d45",
      type: 1,
      docName: "里医生"
    },
    {
      id: "10",
      datetime: "20210428",
      deptName: "儿科",
      description: "主要诊断信息",
      descpCode: "c5d45",
      type: 1,
      docName: "好医生"
    },
    {
      id: "11",
      datetime: "20210428",
      deptName: "儿科",
      description: "主要诊断信息",
      descpCode: "c5d45",
      type: 1,
      docName: "好医生"
    },
    {
      id: "12",
      datetime: "20210428",
      deptName: "儿科",
      description: "主要诊断信息",
      descpCode: "c5d45",
      type: 1,
      docName: "好医生"
    },
    {
      id: "13",
      datetime: "20210428",
      deptName: "内科科",
      description: "主要诊断信息",
      descpCode: "c5d45",
      type: 1,
      docName: "里医生"
    },
    {
      id: "14",
      datetime: "20210428",
      deptName: "儿科",
      description: "主要诊断信息",
      descpCode: "c5d45",
      type: 1,
      docName: "好医生"
    },
  ]

  /**
   * 初始化渲染数据筛选
   */

  const queryEdit = () => {
    if (tabItemType === 1) {
      return (
        <div className={styles.conditionBox}>
          <Radio.Group className={styles.btBox} defaultValue="1001" buttonStyle="solid">
            <Radio.Button value="1001" className={styles.btBoxBt}>长期医嘱</Radio.Button>
            <Radio.Button value="1002" className={styles.btBoxBt}>临时医嘱</Radio.Button>
          </Radio.Group>
          <Radio.Group className={styles.statusList} defaultValue="1" buttonStyle="solid">
            <Radio className={styles.statusItem} value={0}>全部</Radio>
            <Radio className={styles.statusItem} value={1}>新开</Radio>
            <Radio className={styles.statusItem} value={2}>提交</Radio>
            <Radio className={styles.statusItem} value={3}>执行</Radio>
            <Radio className={styles.statusItem} value={4}>停止</Radio>
            <Radio className={styles.statusItem} value={5}>作废</Radio>
          </Radio.Group>
        </div>
      )
    }
  }

  return (
    <div className={styles.medicine}>
      {
        queryEdit()
      }
      <div className={styles.medicineTbale}>
        <Table className={styles.medicineTbaleItem}
          bordered
          rowKey='id'
          scroll={{ y: tableScroll ? tableScroll : 500 }}
          columns={columns}
          dataSource={data}
          pagination={false} />
      </div>
    </div>
  )
}

export default medicine